<template>
  <el-dialog :visible.sync="visible" width="40%" @close="cancel">
    <div v-loading="loading">
      <el-table :data="form.products" stripe border fit>
        <el-table-column :label="`${productLabel}编码`" prop="goods_code" align="center" min-width="120" />
        <el-table-column :label="`${productLabel}名称`" prop="name" align="center" min-width="120" />
        <el-table-column label="补发数量" prop="quantity_purchased" align="center" min-width="120" />
        <el-table-column label="选择补货发货仓库" align="center" width="240">
          <template slot-scope="scope">
            <el-select v-model="scope.row.warehouse_fictitious_id" placeholder="请选择" @change="changeWarehouseHandler($event, scope.row)">
              <el-option v-for="item in scope.row.warehouseList" :key="item.warehouse_fictitious_id" :label="`${item.virtual_warehouse}/${item.product_number}/${item.zone}`" :value="item.warehouse_fictitious_id" />
            </el-select>
          </template>
        </el-table-column>
      </el-table>
      <div class="dialog-footer-center">
        <span>
          <el-button type="primary" :loading="btnLoading" @click="submit">保存</el-button>
          <el-button @click="cancel">取消</el-button>
        </span>
      </div>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: 'ReplenishmentDialog',
  data() {
    return {
      loading: false,
      visible: false,
      type: 1, // 1 商品 还是 2 配件
      btnLoading: false,
      orderId: '',
      form: {
        products: [] // 商品或配件数据
      }
    }
  },
  computed: {
    productLabel() {
      return this.type === 1 ? '商品' : '配件'
    }
  },
  created() { },
  methods: {
    // 显示
    show(id, type) {
      console.log('======>>>>>=')
      const vm = this
      vm.orderId = id
      vm.getInfo() // 获取详情
      vm.visible = true
    },
    cancel() {
      const vm = this
      vm.form.products = []
      vm.orderId = ''
      vm.visible = false
    },
    getInfo() {
      const vm = this
      console.log('==========')
      vm.loading = true
      const requestArr = [
        vm.$http.get(`/afterSaleOrders/addressInfo/${vm.orderId}`),
        vm.$http.get(`/deliveryOrders/warehouseStockList/${vm.orderId}`, { params: { type: 1 } })
      ]
      Promise.all(requestArr).then(res => {
        const [infoRes, warehouseInfoRes] = res
        console.log(res)
        const info = infoRes.data
        console.log('info', info)
        const warehouseInfo = warehouseInfoRes.data
        console.log('warehouseInfo', warehouseInfo)
        vm.type = info.replenish_type
        const data = info.replenish_type === 1 ? info.parts : info.parts // 商品信息
        const listArr = []
        vm.form.products = data.filter(e => e.is_delivery === 0).map(e => {
          if (warehouseInfo[e.goods_code] && warehouseInfo[e.goods_code].length > 0) {
            const list = warehouseInfo[e.goods_code].map((arr) => {
              arr.option1 = arr.options.filter(e => e.product_number > 0 && e.isShopWarehouse === 1)
              if (arr.option1 && arr.option1.length > 0) {
                listArr.push(arr.option1[0])
              }
              // arr.options = arr.options.filter(e => e.product_number > 0)
              return arr
            })
          }
          e['warehouseList'] = warehouseInfo ? listArr : []
          // e['warehouseList'] = warehouseInfo ? warehouseInfo[e.goods_code][0]['options'].filter(e => e.product_number > 0) : []
          e['warehouse_id'] = '' // 实体仓
          e['warehouse_fictitious_id'] = '' // 虚拟仓
          e['zone'] = ''
          return e
        })
        console.log('====>>>>>>====', vm.form.products)
        vm.loading = false
      }).catch(() => {
        vm.loading = false
      })
    },
    /**
     * vId 当前虚拟仓
     * product 商品
     */
    changeWarehouseHandler(vId, product) {
      console.log('vId================')
      console.log(vId)
      let warehouse_id = ''; let zone = ''
      if (vId) {
        const warehouseItem = product.warehouseList.find(e => e.warehouse_fictitious_id === vId)
        warehouse_id = warehouseItem.warehouse_id
        zone = warehouseItem.zone
      }
      product.warehouse_id = warehouse_id
      product.zone = zone
    },
    // 提交表单
    submit() {
      const vm = this
      const index = vm.form.products.findIndex(e => !!e.warehouse_fictitious_id)
      if (index === -1) {
        return vm.$message.error('请至少选择一个商品或配件进行补货')
      }
      const params = { product: [] }
      params.product = vm.form.products.map(e => {
        const obj = {
          code: e.goods_code,
          warehouse_fictitious_id: e.warehouse_fictitious_id,
          warehouse_id: e.warehouse_id,
          zone: e.zone
        }
        return obj
      })
      vm.btnLoading = true
      vm.$http.post(`/deliveryOrders/partDelivery/${vm.orderId}`, params).then(res => {
        vm.$message.success('补货发货成功')
        vm.$emit('success')
        vm.cancel()
        vm.btnLoading = false
      }).catch(() => {
        vm.btnLoading = false
      })
    }
  }
}
</script>

<style lang="scss" scoped></style>
